<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>首页</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <link href="css/common.css" rel="stylesheet" />
    <link href="css/core.css" rel="stylesheet" />
	<link href="css/style.css" rel="stylesheet" />
	<link href="css/elastislide.css" rel="stylesheet" />    
</head>
<body class="index">
	<div class="container">
		<div id="nav" class="clearfix">
			<div class="item fr" data-id="one">
				<a href="show-article.html">文章</a>
				<div class="tab one">
					<ul>
						<li><a href="show-article.html?id=1">文章一</a></li>
						<li><a href="show-article.html?id=2">文章一</a></li>
						<li><a href="show-article.html?id=3">文章一</a></li>
						<li><a href="show-article.html?id=4">文章一</a></li>
						<li><a href="show-article.html?id=5">文章一</a></li>
						<li><a href="show-article.html?id=6">文章一</a></li>
					</ul>
				</div>
			</div>
			<div class="item fr">|</div> 
			<div class="item fr" data-id="two">
				<a href="show-works.html">作品</a>
				<div class="tab two">
					<ul>
						<li><a href="show-works.html?id=1">分类一</a></li>
						<li><a href="show-works.html?id=2">分类一</a></li>
						<li><a href="show-works.html?id=3">分类一</a></li>
						<li><a href="show-works.html?id=4">分类一</a></li>
						<li><a href="show-works.html?id=5">分类一</a></li>
						<li><a href="show-works.html?id=5">分类一</a></li>
					</ul>
				</div>
			</div>			
		</div>
	</div>
	</div>
	<div class="container clearfix">
			<div class="content works">
				<h1>作品分类</h1>
				<div id="rg-gallery" class="rg-gallery">
					<div class="rg-thumbs">
						<!-- Elastislide Carousel Thumbnail Viewer -->
						<div class="es-carousel-wrapper">
							<div class="es-nav">
								<span class="es-nav-prev">Previous</span>
								<span class="es-nav-next">Next</span>
							</div>
							<div class="es-carousel">
								<ul>
									<li><a href="#"><img src="images/1.jpg" data-large="images/1.jpg" alt="image01" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/2.jpg" data-large="images/2.jpg" alt="image02" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/3.jpg" data-large="images/3.jpg" alt="image03" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/4.jpg" data-large="images/4.jpg" alt="image04" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/5.jpg" data-large="images/5.jpg" alt="image05" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/6.jpg" data-large="images/6.jpg" alt="image06" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/7.jpg" data-large="images/7.jpg" alt="image07" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/8.jpg" data-large="images/8.jpg" alt="image08" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/9.jpg" data-large="images/9.jpg" alt="image09" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/10.jpg" data-large="images/10.jpg" alt="image10" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/11.jpg" data-large="images/11.jpg" alt="image11" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/12.jpg" data-large="images/12.jpg" alt="image12" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/13.jpg" data-large="images/13.jpg" alt="image13" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/14.jpg" data-large="images/14.jpg" alt="image14" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/15.jpg" data-large="images/15.jpg" alt="image15" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/16.jpg" data-large="images/16.jpg" alt="image16" data-description="作品描述" /></a></li>
									<li><a href="#"><img src="images/17.jpg" data-large="images/17.jpg" alt="image17" data-description="作品描述" /></a></li>
								</ul>
							</div>
						</div>
						<!-- End Elastislide Carousel Thumbnail Viewer -->
					</div><!-- rg-thumbs -->
				</div><!-- rg-gallery -->
			</div><!-- content -->		
	</div>
	<script id="img-wrapper-tmpl" type="text/x-jquery-tmpl">	
		<div class="rg-image-wrapper">
			{{if itemsCount > 1}}
				<div class="rg-image-nav">
					<a href="#" class="rg-image-nav-prev">Previous Image</a>
					<a href="#" class="rg-image-nav-next">Next Image</a>
				</div>
			{{/if}}
			<div class="rg-image"></div>
			<div class="rg-loading"></div>
			<div class="rg-caption-wrapper">
				<div class="rg-caption" style="display:none;">
					<p></p>
				</div>
			</div>
		</div>
	</script>		
	<script src="http://cdn.staticfile.org/jquery/1.7.2/jquery.min.js"></script>
	<script>window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')</script>
	<script type="text/javascript">
		$(function(){
			// 导航
			$('#nav .item').mouseover(function(){
				var cs = $(this).attr('data-id');
				$('#nav .tab').hide();
				$('#nav .' + cs).css({
					left: $(this).offset().left,
					top: $(this).offset().top+50
				}).show();
			}).mouseout(function(){
				$('#nav .tab').hide();
			});
		});
	</script>
	<script type="text/javascript" src="js/jquery.tmpl.min.js"></script>
	<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
	<script type="text/javascript" src="js/jquery.elastislide.js"></script>
	<script type="text/javascript" src="js/gallery.js"></script>
</body>
</html>
